import React, {JSX} from 'react';
import {ImageBackground, View, StyleSheet} from 'react-native';
import {BasicText} from '../../kit/text';
import {BasicNavBar} from '../../kit/navigationBar';
import { normalize } from '../../utils/adapter';

export type Props = {
  value: number;
};

export default function ({value}: Props): JSX.Element {
  return (
    <ImageBackground
      style={styles.header_container}
      source={require('../../assets/images/withdraw_bg.png')}>
      <BasicNavBar title="提现记录" bgColor="rgba(0,0,0,0)" color="#fff" />
      <View style={styles.contant_view}>
        <BasicText fontSize={normalize(14)} fontWeight={'bold'}>
          历史总提现
        </BasicText>
        <View style={styles.val_view}>
          <BasicText fontSize={normalize(32)} fontWeight={'bold'}>{value}</BasicText>
          <View style={styles.unit_view}>
             <BasicText fontSize={normalize(14)}>元</BasicText>
          </View>
        </View>
      </View>
    </ImageBackground>
  );
}

const styles = StyleSheet.create({
  header_container: {
    height: normalize(342),
  },
  contant_view: {
    flex: 1,
    paddingHorizontal: normalize(32),
    paddingTop: normalize(36),
  },
  val_view:{
    marginTop:normalize(12),
    flexDirection:'row',
    alignItems:'flex-end',
  },
  unit_view:{
    transform:[{translateY:normalize(-14 / 2)},{translateX:normalize(10)}],
  },
});
